<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body><!-- 最大框 -->
		<div class="top">
			<!-- 上小框 -->
			<div class="top_l" id="top1">
				<!-- 左侧 -->
				<div class="left"></div>
				<!-- 右侧 -->
				<div class="right">
					<!-- 照片 -->
					<div class="ph">
						<img src="img/a.png" width="60" height="60" id="photo">
					</div>
					<!-- 文字 -->
					<div class="help" id="helps">
						<div class="shang"></div>
						<div class="xia" >
						admin
						<span id="nt">通知</span><span><a href="#" id="notice">3</a></span>
					</div>	
				</div>	
			</div>
		</div>
		</div>
		<!-- 中间部分 -->
		<div class="mid">
			<div class="a"></div>
			<div class="b">当前位置:</div>
		</div>
		<!-- 导航栏 -->
		<div class="daohang">
			<div class="lie">
				 <h3 class="hp"> 人员信息管理</h3>
				 <ul >
				  <li><a href="main.html" target="right">人员信息</a></li>
				  <li><a href="add.html" target="right">添加信息</a></li>
				  <li><a href="qiyong.html" target="right">启用信息</a></li>
				</ul>
				 <h3 class="hp"> 出勤管理</h3>
				<ul>
				  <li><a href="chuqing.html" target="right">出勤情况</a></li>
				  <li><a href="meiyue.html" target="right">每月出勤</a></li>
				  <li><a href="dangyue.html" target="right">当月出勤</a></li>
				</ul>
				<h3 class="hp"> 系统管理</h3>
				<ul>
				  <li>角色管理</li>
				  <li>权限管理</li>
				  <li>角色分配</li>
				  <li>登录日志</li>
				  <li>系统配置</li>
				 </ul>
			</div>
			<!-- 主题 -->
			 <iframe name="right" id="rightMain" src="main.html" frameborder="no" scrolling="auto" width="80%" height="100%" allowtransparency="true" style="margin-left: 206px;"></iframe>
		</div>
	
	 
	</body>
	<style>
		*{
		 margin: 0;
         padding: 0;
         list-style: none;
		}
		/* 设置高和背景 */
		.top{
			background: url(img/top.gif)0 0 repeat-x;
			height: 80px;
			;
		}
		/* 设置左侧背景和高 */
		.left{
			background: url(img/1.2.png);
			width: 350px;
			height: 80px;
			float: left;
		}
		/* 设置右侧高 */
		.right{
			width: 280px;
			height: 80px;
			float: right;
		}
		/* 设置帮助栏的背景和高 */
		.help{
			background: url(img/user_info.png);
			width: 210px;
			height: 80px;
		}
		/* 设置浮动 */
		.ph{
			float: left;
			padding-top: 10px;
		}
		#helps{
			float: right;
		}/* 设置中部分的高 */
		.shang{
	      height: 22px;
          padding-top: 13p;
		}
		/* 设置中部分下 */
		.adminx{
			padding: 10px 30px;
		}
		.xia{
			padding-left: 50px;
			padding-top: 20px;
			color: white;
		}
		
		/* 设置中部分的背景 */
		
		.mid{
			background:#fff url(img/here.gif)0 0 repeat-x;
			height: 40px;
		}
		.a{
			background: url(img/menu.gif);
			width: 206px;
            height: 40px;
			float: left;
		}
		.b{
			float: left;
			margin-top: 10px;
			margin-left: 10px;
			font-family: "黑体";
		}
		/* 设置到货栏背景和高 */
		.daohang{
			background: url(img/side_bg.gif) repeat-y;
			height: 600px;
			

		}
		.lie{
		
		}
		/* 设置列的背景字体 */
		.lie,.hp{
			height:38px; line-height:38px; cursor:pointer;
			font:normal 14px/38px "Microsoft YaHei";
			font-weight: bold;
			background:url(img/side_h3.gif) 0px 0px no-repeat;
		}
		.hp{
			padding-left: 45px;
		}
		li{
			background: url(img/side_li.gif)40px 15px no-repeat;
			padding-left: 50px;
		}
	</style>
</html>
